﻿@model Promocot.Models.vistaCotizacion
@{
    ViewBag.Title = "Nueva Cotización";
    List<SelectListItem> elstatus = new List<SelectListItem>();

    elstatus.Add(new SelectListItem() { Text = Promocot.Models.Status.borrador, Value = "Borrador" });
    elstatus.Add(new SelectListItem() { Text = Promocot.Models.Status.plantilla, Value = "Plantilla" });


    List<SelectListItem> genero = new List<SelectListItem>();
    genero.Add(new SelectListItem() { Text = " ", Value = "N" });
    genero.Add(new SelectListItem() { Text = "Masculino", Value = "M" });
    genero.Add(new SelectListItem() { Text = "Femenino", Value = "F" });
}
<script type="text/javascript" src="@Url.Content("~/Content/tinymce/jscripts/tiny_mce/jquery.tinymce.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Content/tinymce/jscripts/tiny_mce/tiny_mce.js")"></script>
<link href="@Url.Content("~/Content/jquery.fileupload-ui.css")" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="@Url.Content("~/Scripts/jquery.iframe-transport.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/jquery.fileupload.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/jquery.fileupload-ui.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/application.js")"></script>
<script id="template-upload" type="text/x-jquery-tmpl">
    <tr class="template-upload{{if error}} ui-state-error{{/if}}">
        <td class="preview"></td>
        <td class="name">${name}</td>
        <td class="size">${sizef}</td>
        {{if error}}
            <td class="error" colspan="2">Error:
                {{if error === 'maxFileSize'}}File is too big
                {{else error === 'minFileSize'}}File is too small
                {{else error === 'acceptFileTypes'}}Filetype not allowed
                {{else error === 'maxNumberOfFiles'}}Max number of files exceeded
                {{else}}${error}
                {{/if}}
            </td>
        {{else}}
            <td class="progress"><div></div></td>
            <td class="start"><button>Start</button></td>
        {{/if}}
        <td class="cancel"><button>Cancel</button></td>
    </tr>
</script>
<script id="template-download" type="text/x-jquery-tmpl">
    <tr class="template-download{{if error}} ui-state-error{{/if}}">
        {{if error}}
            <td></td>
            <td class="name">${name}</td>
            <td class="size">${sizef}</td>
            <td class="error" colspan="2">Error:
                {{if error === 1}}File exceeds upload_max_filesize (php.ini directive)
                {{else error === 2}}File exceeds MAX_FILE_SIZE (HTML form directive)
                {{else error === 3}}File was only partially uploaded
                {{else error === 4}}No File was uploaded
                {{else error === 5}}Missing a temporary folder
                {{else error === 6}}Failed to write file to disk
                {{else error === 7}}File upload stopped by extension
                {{else error === 'maxFileSize'}}File is too big
                {{else error === 'minFileSize'}}File is too small
                {{else error === 'acceptFileTypes'}}Filetype not allowed
                {{else error === 'maxNumberOfFiles'}}Max number of files exceeded
                {{else error === 'uploadedBytes'}}Uploaded bytes exceed file size
                {{else error === 'emptyResult'}}Empty file upload result
                {{else}}${error}
                {{/if}}
            </td>
        {{else}}
            <td class="preview">
                {{if thumbnail_url}}
                    <a href="${url}" target="_blank"><img src="${thumbnail_url}"></a>
                {{/if}}
            </td>
            <td class="name">
                <a href="${url}"{{if thumbnail_url}} target="_blank"{{/if}}>${name}</a>
            </td>
            <td class="size">${sizef}</td>
            <td colspan="2"></td>
        {{/if}}
        <td class="delete">
            <button data-type="${delete_type}" data-url="${delete_url}">Delete</button>
        </td>
    </tr>
</script>
<style type="text/css">
    input, textarea
    {
        border: 1px solid blue;
    }
    
    #nueva_titulo_cotizacion
    {
        width: 360px;
    }
    #lista_imagenes
    {
        border: 1px solid yellow;
        height: 60px;
        color: Black;
        background-color: Yellow;
    }
</style>
<script type="text/javascript">
    var cuenta = 0;
    $(function () {
        $("#nueva_year, #nueva_Destino_Id, #nueva_Temporada_Id").change(function () {
            $("#nueva_titulo_cotizacion").val($("#nueva_Destino_Id option:selected").text() + ": " + $("#nueva_Temporada_Id option:selected").text() + " " + $("#nueva_year").val());
        });


        /*$('#nueva_descripcion_html').markItUp(mySettings);*/
        $('#nueva_descripcion_html, #nueva_incluye, #nueva_noincluye, #nueva_observaciones, #nueva_imagenes_adicionales').tinymce({
            // General options
            theme: "advanced",
            width: "375px",
            height: "500px",
            // Theme options
            theme_advanced_buttons1: "bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull",
            theme_advanced_toolbar_location: "top",
            theme_advanced_toolbar_align: "left",
            theme_advanced_statusbar_location: "bottom",
            theme_advanced_resizing: false
        });

        $("#dlg_cliente").dialog({
            autoOpen: false,
            show: "blind",
            hide: "explode"
        });

        $("#nueva_fecha_inicio, #nueva_fecha_fin").datepicker({
            dayNames: ['Domingo', 'Lunes', 'Martes', 'Miercoles', 'Jueves', 'Viernes', 'Sabado'],
            dayNamesShort: ['Dom', 'Lun', 'Mar', 'Mie', 'Jue', 'Vie', 'Sab'],
            dayNamesMin: ['Do', 'Lu', 'Ma', 'Mi', 'Ju', 'Vi', 'Sa'],
            monthNamesShort: ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun', 'Jul', 'Ago', 'Sep', 'Oct', 'Nov', 'Dic'],
            changeMonth: true,
            changeYear: true,
            dateFormat: "dd/mm/yy"
        });

        $("#nueva_fecha_inicio").change(function () {
            actualizarFechas();
        });

        $("#nueva_noches").change(function () {
            actualizarFechas();
        });

        $("#nueva_fecha_fin").change(function () {
            
            fecha_inicio = $("#nueva_fecha_inicio").val();
            var fecha_isplit = fecha_inicio.split("/");
            inicio = Date.parse(fecha_isplit[1] + "/" + fecha_isplit[0] + "/" + fecha_isplit[2]);
            fecha_fin = $("#nueva_fecha_fin").val();
            fecha_isplit = fecha_fin.split("/");
            fin = Date.parse(fecha_isplit[1] + "/" + fecha_isplit[0] + "/" + fecha_isplit[2]);
            var one_day = 1000 * 60 * 60 * 24;
            var resultado = Math.ceil((fin - inicio) / (one_day));
            $("#nueva_noches").val(resultado);
            
        });

        $("#preliminares").draggable();
        $("#idCot").val("0");
        $("#clienteID").val("0");
        $("#nueva_texto_intro").html("De antemano reciban un cordial saludo. Por medio de la presente le estamos enviando la cotización solicitada por usted. Si no fuera de su agrado, con gusto le enviaremos otra. Tenemos la más amplia oferta turística. ");

        $("#cargarCliente").click(function () {
            $("#dlg_cliente").load('/Cotizacion/nuevoCliente');
            $("#dlg_cliente").dialog("open");
            return false;
        });

    });

    function actualizarFechas() {
        fecha_inicio = $("#nueva_fecha_inicio").val();
        fecha_isplit = fecha_inicio.split("/")
        inicio = Date.parse(fecha_isplit[1] + "/" + fecha_isplit[0] + "/" + fecha_isplit[2]);
        num_dias = parseInt($("#nueva_noches").val()); //aqui tengo el numero de dias
        miliseg = num_dias * 86400000;
        final = inicio + miliseg;
        fechafin = new Date(final);
        $("#nueva_fecha_fin").datepicker("setDate", fechafin);
        $("#nueva_fecha_fin").datepicker("option", "minDate", fechafin);
    }

    function actualizarNoches() {

        
        
    }

</script>
<div id="formatos">
</div>
<div id="vistaFormatos">
    @using (Ajax.BeginForm("registrarCotizacion", "Cotizacion", new AjaxOptions { }))
    {
        <div id="preliminares">
            <table>
                <tr>
                    <td>
                        <span style="color: Red;">(*)</span>Destino:
                    </td>
                    <td>
                        <span style="color: Red;">(*)</span>Temporada:
                    </td>
                    <td>
                        Año:
                    </td>
                </tr>
                <tr>
                    <td>
                        @Html.DropDownListFor(model => model.nueva.Destino.Id, new SelectList(ViewBag.destinos, "Id", "nombre_destino"))
                    </td>
                    <td>
                        @Html.DropDownListFor(model => model.nueva.Temporada.Id, new SelectList(ViewBag.temporadas, "Id", "nombre_temporada"))
                    </td>
                    <td>
                        @Html.DropDownListFor(model => model.nueva.year, new SelectList(ViewBag.anios, "Text", "Value"))
                    </td>
                    <td>
                        @Html.HiddenFor(model => model.nueva.Usuario.cod_usuario),@Html.HiddenFor(model => model.nueva.Id)
                    </td>
                </tr>
            </table>
        </div>
        <div id="default_formato">
            <p>
                Cararacas, @DateTime.Now.ToString("d 'de' MMMM 'de' yyyy ", System.Globalization.CultureInfo.CreateSpecificCulture("es-ES"))</p>
            <div id="saludo">
                <h4>
                    Datos del cliente</h4>
                <table>
                    <tr>
                        <th>
                            <span style="color: Red;">(*)</span> Nombre (completo):
                        </th>
                        <td>
                            @Html.EditorFor(model => model.nuevoCliente.Nombre)
                        </td>
                    </tr>
                    <tr>
                        <th>
                            <span style="color: Red;">(*)</span> Correo:
                        </th>
                        <td>
                            @Html.EditorFor(model => model.nuevoCliente.email)
                        </td>
                    </tr>
                    <tr>
                        <th>
                            <span style="color: Red;">(*)</span> Género:
                        </th>
                        <td>
                            @Html.DropDownListFor(model => model.nuevoCliente.sexo, new SelectList(genero, "Value", "Text"))
                        </td>
                    </tr>
                </table>
                @Html.Hidden("clienteID")
            </div>
            <div id="contenido">
                <p>
                    Texto Introductorio:
                </p>
                @Html.TextAreaFor(model => model.nueva.texto_intro)
                <p>
                    <span style="color: Red;">(*)</span> Título de la cotización</p>
                @Html.EditorFor(model => model.nueva.titulo_cotizacion)
                <p>
                    Formateado: @Html.CheckBoxFor(model => model.nueva.formateado) (Active esta opción
                    sólo si desea conservar texto e imágenes).</p>
                <p>
                    <span style="color: Red;">(*)</span> Información de la cotización: (Itinerarios,tarifas,
                    etc.)
                </p>
                @Html.TextAreaFor(model => model.nueva.descripcion_html)
                <p>
                    Incluye</p>
                @Html.TextAreaFor(model => model.nueva.incluye)
                <p>
                    No incluye</p>
                @Html.TextAreaFor(model => model.nueva.noincluye)
                <p>
                    Observaciones</p>
                @Html.TextAreaFor(model => model.nueva.observaciones)
                <p>
                    Imagenes Adicionales</p>
                @Html.TextAreaFor(model => model.nueva.imagenes_adicionales)
                @Html.HiddenFor(model => model.nueva.eshijode)
                <table>
                    <tr>
                        <td>
                            <span style="color: Red;">(*)</span> Fecha Inicio
                        </td>
                        <td>
                            <span style="color: Red;">(*)</span> Noches
                        </td>
                        <td>
                            Fecha Final
                        </td>
                    </tr>
                    <tr>
                        <td>@Html.EditorFor(model => model.nueva.fecha_inicio)
                        </td>
                        <td>@Html.EditorFor(model => model.nueva.noches)
                        </td>
                        <td>@Html.EditorFor(model => model.nueva.fecha_fin)
                        </td>
                    </tr>
                    <tr>
                        <!--<td>Status</td>-->
                        <td>
                            Precio referencial
                        </td>
                    </tr>
                    <tr>
                        @if (ViewBag.editar != null)
                        {
                            <td>@Html.DropDownListFor(model => model.nueva.status, new SelectList(elstatus, "Text", "Value"))
                            </td>
                        }
                        <td>@Html.EditorFor(model => model.nueva.precio_referencial)
                        </td>
                        <td>
                            <input type="submit" value="Registrar Cotización" />
                        </td>
                    </tr>
                </table>
            </div>
        </div>
    }
</div>
<div id="preview">
</div>
<div id="zona_imagen" style="display: none;">
    <div id="fileupload">
        @using (Html.BeginForm("SubirImagenes", "Cotizacion", FormMethod.Post, new { enctype = "multipart/form-data" }))
        {
            <div class="fileupload-buttonbar">
                <label class="fileinput-button">
                    <span>Add files...</span>
                    <input type="file" name="files[]" multiple />
                </label>
                <button type="submit" class="start">
                    Start upload</button>
                <button type="reset" class="cancel">
                    Cancel upload</button>
                <button type="button" class="delete">
                    Delete files</button>
                @Html.Hidden("idCot")
            </div>
            <div class="fileupload-content">
                <table class="files">
                </table>
                <div class="fileupload-progressbar">
                </div>
            </div>
        }
    </div>
</div>
<div id="dlg_cliente" style="display: none;">
    Perfecto
</div>
